<template>
<div class="box">
    <label>帐号：<input type="text" v-model="username"></label>
    <label>密码：<input type="password" v-model="password"></label>
    <button @click="reset()">重置表单</button>
  </div>
</template>

<script>
// 组件的注册使用步骤：
// 1. 创建组件 (创建vue文件)
//   2. 导入组件 (script -> import导入)
//   3. 注册组件 (script -> components注册)
//   4. 使用组件 (template -> 使用)
export default{
//行为 
data(){
  return{
    username:'',
    password:'',
  }
},
methods:{
  reset(){
    this.username=''
    this.password=''
  }
}
}
</script>

<style scoped>
/*样式*/
.box{
  border:2px soild #000;
  padding:20px;
}
</style>